@charset "utf-8";
@import "../../assets/css/config";

.view-loading {
	@include flex;
	@include flexCenterHori;
	@include flexCenterVeri;
}


.loading{
	width: 2.0rem;
	color: $primary;
	font-size: 0.24rem;
	&__inner{
		margin: 0 auto 0.3rem auto;
		position: relative;
		width: 0.8rem;
		height: 0.8rem;
		&__shan{
			width: 0.8rem;
			height: 0.8rem;
			position: absolute;
			top: 0;
			left: 0;
			background: url("../../assets/images/icon_loading_shan.png") 50% no-repeat;
			background-size: cover;
			transform-origin: 50% 50%;
			&.run{
				animation: loadingShan 2s linear infinite;
			}
		}
		&__chelun{
			width: 0.8rem;
			height: 0.8rem;
			position: absolute;
			top: 0;
			left: 0;
			background: url("../../assets/images/icon_loading_chelun.png") 50% no-repeat;
			background-size: cover;
			z-index: 9;
			transform-origin: 50% 50%;
			&.run{
				animation: loadingChelun 2s linear infinite;
			}
		}
	}
	p{
		text-indent: 0.1rem;
		text-align: center;
	}
}


@keyframes loadingShan{
	0%{
		transform: rotate(0)
	}
	100%{
		transform: rotate(-360deg)
	}
}
@keyframes loadingChelun{
	0%{
		transform: rotate(0)
	}
	100%{
		transform: rotate(360deg)
	}
}